<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no,viewport-fit=cover">
    <!-- <link rel="icon" href=""> -->
  <title>人人商城</title>
    <meta content="yes" name="apple-touch-fullscreen">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <link rel="stylesheet" href="/css/format.css">
    <style>
      body{
        background: #fff;
      }
      /*header*/
      .orderList_header_container{

      }
      .orderList_headerTitle_container{
      	display: flex;
      	align-items: center;
      	justify-content: space-between;
      	padding: 0.3rem .4rem;
      	border-bottom: 1px solid #ececec;
      	background: #fbfbfb;
      }
      .orderList_headerTitle_container p{
      	font-size: .28rem;
      	color: #777;
      	font-weight: bold;
      }
      .orderList_headerTitle_container svg{
      	width: .4rem;
      	height: .4rem;
      	cursor: pointer;
      }
      .orderList_headerSearch_container{
      	display: flex;
      	align-items: center;
      	justify-content: space-between;
      	padding: 0.3rem .4rem;
      	border-bottom: 1px solid #ececec;
      }
      .orderList_headerSearch_container input{
      	outline: none;
      	appearance: none;
      	border: none;
      	font-size: .28rem;
      	color: #333;
      	flex: 1;
      	border-right: 1px solid #c7c7c7;
      }
      .orderList_headerSearch_container svg{
      	width: .4rem;
      	height: .4rem;
      	cursor: pointer;
      	margin-left: .3rem;
      }
      /*main*/
      .orderList_Main_container{

      }
      .orderList_List_container{
      	border-bottom: 1px solid #ececec;
      	padding-bottom: .1rem;
      }
      .orderList_List_container p{

      }
      .orderList_ListNum_container{
      	padding: 0rem .4rem .1rem .4rem;
      	display: flex;
      	align-items: center;
      	justify-content: space-between;
      }
      .orderList_ListNum_container p{
      	color: #333;
      	font-size: .28rem;
      }
      .orderList_ListNum_container span{
      	color: #666;
      	cursor: pointer;
      	font-size: .28rem;
      	flex: 1;
      	text-align: right;
      }
      .orderList_ListGoods_container{
      	display: flex;
      	align-items: center;
      	padding: 0 .4rem .1rem .4rem;
      }
      .orderList_ListGoods_container img{
      	width: 1rem;
      	height: 1rem;
      }
      .orderList_ListGoods_content{
      	flex: 1;
      	display: flex;
      	flex-direction: column;
      	justify-content: space-around;
      	height: 1rem;
      	padding-left: .2rem;
      	overflow: hidden;
      }
      .orderList_ListGoods_content h3{
      	font-size: .28rem;
      	color: #333;
      	overflow: hidden;
      	text-overflow: ellipsis;
      	white-space: nowrap;
      }
      .orderList_ListGoods_content h4{
      	font-size: .26rem;
      	color: #828282;
      }
      .orderList_ListState_container{
      	display: flex;
      	align-items: center;
      	padding: .2rem .4rem;
      }
      .orderList_ListState_container p{
      	color: #1890ff;
      	font-size: 0.28rem;
      }
      .orderList_ListState_content{
      	display: flex;
      	align-items: center;
      	flex: 1;
      	overflow: hidden;
      }
      .orderList_ListState_content span{
      	color: #333;
      	font-size: .28rem;
      	overflow: hidden;
      	text-overflow: ellipsis;
      	white-space: nowrap;
      	flex: 1;
      }
      .orderList_ListState_content svg{
      	width: .3rem;
      	height: .3rem;
      	margin-right: .1rem;
      	fill: #888;
      }
      .orderList_ListNoData_container{

      }
      .orderList_ListNoData_container p{
      	text-align: center;
      	padding: .2rem 0;
      	font-size: .28rem;
      	color: #888;
      }
      /*版权信息*/
      .public_copyright_container{
        
      }
      .public_copyright_content{
        position: relative;
        margin: 30px;
        display: flex;
        justify-content: center;
        align-items: center;
        background: url(http://weidogstest.oss-cn-beijing.aliyuncs.com/0d118b616ad13e1f874e458c8310be76.png)no-repeat center center;
      }
      .public_copyright_content p{
        background: #fff;
        font-size: 13px;
        color: #999;
        line-height: 17px;
        text-align: center;
        padding: 0 5px;
      }
    </style>
  </head>
  <body>
    <div class="orderList_header_container">
    	<div class="orderList_headerTitle_container">
    		<p>Ta购买的全部商品（{count($order_list)}）</p>
    	</div>
    	<div class="orderList_headerSearch_container" style="display: none;">
    		<input type="text" name="" placeholder="请输入商品名称~">
    		<svg t="1608258752426" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3157" width="50" height="50"><path d="M446.112323 177.545051c137.567677 0.219798 252.612525 104.59798 266.162424 241.493333 13.562828 136.895354-78.778182 261.818182-213.617777 289.008485-134.852525 27.203232-268.386263-52.156768-308.945455-183.608889s25.018182-272.252121 151.738182-325.779394A267.235556 267.235556 0 0 1 446.112323 177.545051m0-62.060607c-182.794343 0-330.989899 148.195556-330.989899 330.989899s148.195556 330.989899 330.989899 330.989899 330.989899-148.195556 330.989899-330.989899-148.195556-330.989899-330.989899-330.989899z m431.321212 793.341415a30.849293 30.849293 0 0 1-21.94101-9.102223l-157.220202-157.220202c-11.752727-12.179394-11.584646-31.534545 0.37495-43.50707 11.972525-11.972525 31.327677-12.140606 43.494141-0.37495l157.220202 157.220202a31.036768 31.036768 0 0 1 6.723232 33.810101 31.004444 31.004444 0 0 1-28.651313 19.174142z m0 0" p-id="3158" fill="#6f6f71"></path></svg>
    	</div>
    </div>
    <div class="orderList_Main_container">
    	<!-- 列表 -->
      {loop $order_list as $order}
    	<div class="orderList_List_container">
    		<div class="orderList_ListState_container">
    			<div class="orderList_ListState_content">
    				<svg t="1608260910346" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6428" width="25" height="25"><path d="M5.821077 426.040233c0 53.323463 40.4779 97.755418 95.068216 110.583584l0 376.50505L37.510824 913.128867c-17.45965 0-31.689746 12.827143-31.689746 28.664853 0 15.835663 14.230096 28.646434 31.689746 28.646434l950.684204 0c17.577331 0 31.689746-12.827143 31.689746-28.646434s-14.112416-28.64848-31.69077-28.64848L924.816558 913.14524 924.816558 536.62484c54.590316-12.82919 95.068216-57.261145 95.068216-110.583584L1019.884774 397.393799 5.821077 397.393799 5.821077 426.040233zM639.610888 540.64541c70.071915 0 126.757962-51.310619 126.757962-114.605178 0 53.323463 40.4779 97.755418 95.068216 110.583584l0 376.50505L386.094964 913.128867l0-372.483456c70.071915 0 126.757962-51.310619 126.757962-114.605178C512.852926 489.334791 569.657676 540.64541 639.610888 540.64541zM354.405217 536.62484l0 376.50505L164.268786 913.12989 164.268786 536.62484c54.590316-12.82919 95.068216-57.261145 95.068216-110.583584C259.338025 479.363695 299.814901 523.795651 354.405217 536.62484zM893.126812 139.517567 132.580063 139.517567 5.821077 368.728946l1014.063697 0L893.126812 139.517567zM273.568121 203.200982l-63.379493 114.606201c-2.838651 5.036713-8.417717 7.943926-14.230096 7.943926-2.349511 0-4.76656-0.438998-7.048533-1.50426-7.791453-3.51608-11.019984-12.151761-7.04751-19.200294l63.378469-114.606201c3.955078-7.04751 13.419637-9.904581 21.228487-6.439666C274.311041 187.533141 277.404496 196.152449 273.568121 203.200982zM400.32506 203.200982l-63.378469 114.606201c-2.839675 5.036713-8.417717 7.943926-14.231119 7.943926-2.349511 0-4.765537-0.438998-7.04751-1.50426-7.791453-3.51608-11.019984-12.151761-7.048533-19.200294l63.379493-114.606201c3.955078-7.04751 13.487176-9.904581 21.227464-6.439666C401.070027 187.533141 404.162458 196.152449 400.32506 203.200982zM528.705985 311.435055c0 7.943926-7.064906 14.332427-15.85306 14.332427-8.738012 0-15.85306-6.372128-15.85306-14.332427L496.999866 196.828854c0-7.943926 7.115048-14.332427 15.85306-14.332427 8.788154 0 15.85306 6.372128 15.85306 14.332427L528.705985 311.435055zM710.66313 323.974649c-2.467191 1.234107-5.070482 1.791809-7.67275 1.791809-5.577019 0-11.019984-2.687202-13.858636-7.436366l-69.328995-114.606201c-4.207835-6.946202-1.351787-15.666818 6.304589-19.419282 7.55507-3.802606 17.323551-1.351787 21.548782 5.64558L716.983069 304.555367C721.056851 311.485197 718.33588 320.223209 710.66313 323.974649zM836.812225 324.245825c-2.24718 1.065262-4.580319 1.50426-7.063883 1.50426-5.814426 0-11.391445-2.907213-14.112416-7.943926L752.256434 203.200982c-3.955078-7.04751-0.743944-15.667841 7.04751-19.200294 7.691169-3.515057 17.324574-0.675382 21.296025 6.439666l63.379493 114.606201C847.814814 312.094064 844.738755 320.730769 836.812225 324.245825zM275.190061 745.570663l0-66.015529c-9.29469-5.053086-15.852036-13.774725-15.852036-24.285103 0-15.83771 14.230096-28.64848 31.688723-28.64848 17.577331 0 31.689746 12.82919 31.689746 28.64848 0 10.510378-6.506181 19.249413-15.85306 24.303522l0 66.015529c9.346879 5.053086 15.85306 13.774725 15.85306 24.303522 0 15.83771-14.112416 28.646434-31.689746 28.646434-17.458627 0-31.688723-12.827143-31.688723-28.646434C259.338025 759.363807 265.895371 750.625796 275.190061 745.570663zM132.580063 82.205257c0-15.836687 14.230096-28.647457 31.689746-28.647457l697.16828 0c17.577331 0 31.689746 12.81077 31.689746 28.647457s-14.112416 28.647457-31.689746 28.647457l-697.16828 0C146.810159 110.87011 132.580063 98.041944 132.580063 82.205257zM561.240983 694.040033l-22.394033-20.264533 89.626273-81.038688 22.394033 20.264533L561.240983 694.040033zM561.240983 775.080767l-22.394033-20.264533 179.235151-162.080445 22.394033 20.264533L561.240983 775.080767zM718.099497 673.7755l22.394033 20.264533-89.626273 81.040734-22.394033-20.264533L718.099497 673.7755z" p-id="6429"></path></svg>
    			</div> 
    			<p>{if $order->shop_status == 1}订单已完成{else}订单未完成{/if}</p>
    		</div>
    		<div class="orderList_ListGoods_container">
    			<img src="{$order->shop_image}">
    			<div class="orderList_ListGoods_content">
    				<h3>{$order->product_name}</h3>
    				<h4>共{$order->shop_sum}件商品，合计￥{$order->shop_sum*$order->shop_price}</h4>
    			</div>
    		</div>
    		<div class="orderList_ListNum_container">
    			<p>下单时间：</p>
    			<!-- data-clipboard-text属性为订单号 点击复制用 -->
    			<span>{$order->pay_time}</span>
    		</div>
    		<div class="orderList_ListNum_container">
    			<p>订单编号：</p>
    			<!-- data-clipboard-text属性为订单号 点击复制用 -->
    			<span class="copyNum" data-clipboard-text="E2020080761517027800071">{$order->order_no}</span>
    		</div>
    	</div>
      {/loop}
    	<div class="orderList_ListNoData_container">
    		<p>{if $hint}{$hint}{else}没有更多了~{/if}</p>
    	</div>
    </div>
    <!-- 版权 -->
    <div class="public_copyright_container">
      <div class="public_copyright_content">
        <p>{$copyright}</p>
      </div>
    </div>
    <script src="/cdn/jquery.min.20.js"></script>
    <script src="/cdn/clipboard.js"></script>
    <!-- 复制粘贴 -->
    <script>
    	var clipboard = new ClipboardJS('.copyNum');

    	clipboard.on('success', function(e) {
    		alert('复制订单号成功');
    		console.info(e.text);
    	});

    	clipboard.on('error', function(e) {
    		console.error('Action:', e.action);
    		console.error('Trigger:', e.trigger);
    	});
    </script>
    <script type="text/javascript">
    	// 点击搜索图标
    	$('#showSearch').click(function(){
    		$('.orderList_headerTitle_container').css('display','none');
    		$('.orderList_headerSearch_container').css('display','flex');
    	})
    </script>
  </body>
</html>
